<style>
.header ul li a {
    cursor: pointer; /* 让鼠标在链接上显示指针光标 */
}

.header ul li a:hover {
    cursor: pointer; /* 悬停时依然显示指针光标 */
    user-select: none; /* 防止选中文本 */
}

.nav {
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 600px;
	margin-right: 10%;
}

.nav li ul{
	position: absolute;
	/* background-color: aqua; */
	display: none;
}

.nav li:hover div{
	display: block;
}

.suboption{
	/* width: 100%; */
	/* height: 300px; */
	position: absolute;
	/* top: 6vh; */
	left: 50vw;
	padding: 10px;
	padding: 0;
	padding-top: 20px;
	display: none;
	width: 99vw;
	margin-left: -50vw;
	border-radius: 5px;
}

.suboption div div{
	margin: 10px;
}

.header a:hover{
	color: rgba(35, 117, 255, 1);
}

li{
	list-style: none;
}

</style>

<header class="header">
    <div>
        <img src="{{base_url}}/images/logo.png" alt="">
        <div>
            <p style="font-weight: bold;color: white;">ASWM</p>
            <p style="font-weight: bold;color: white;font-size: 11px;">安夀理财</p>
            <p style="font-weight: bold;color: white;font-size: 5px;">Anshou Financicl Services Ltd</p>
        </div>
    </div>

    <ul class="nav">
		{{if navSub}}
			<li><a href="/" data-lang="首頁">首頁</a></li>
		{{else}}
			<li><a class="active" href="/" data-lang="首頁">首頁</a></li>
		{{/if}}
		
		
	{{if nav.length>0}}
		{{each nav}}
		{{if $value.status == 0}}
			{{if $value.type==0}}
			
			{{if navSub}}
				{{if $value.name==navSub.cate.name}}
				<li class="about"><a class="active" href="{{$value.path}}/index.html" data-lang="{{$value.name}}">{{$value.name}}</a>
				{{else}}
				<li class="about"><a href="{{$value.path}}/index.html" data-lang="{{$value.name}}">{{$value.name}}</a>
				{{/if}}
			{{else}}
			<li class="about"><a href="{{$value.path}}/index.html" data-lang="{{$value.name}}">{{$value.name}}</a>
			{{/if}}
				{{if nav.length>0 && $value.pinyin == 'guanwuwomen'}}
				<div class="suboption">
					<div style="display: flex;justify-content: space-between;background: rgba(214, 214, 214, 0.12);backdrop-filter: blur(70px);margin-top: 30px;">
						<div><!--占位--></div>
						<div style="display: flex;flex-direction: row;">
							<div style="width: 11.5vw;"></div>
							{{each nav}}
							<div>
								{{if $value.children && $value.children.length>0}}
									{{each $value.children}}
									{{if $value.status == 0}}
									<div>
										 {{if $value.type==0}}
											 {{if navSub}}
												{{if $value.name==navSub.cate.name}}
												<a class="active" href="{{$value.path}}/index.html" data-lang="{{$value.name}}">{{$value.name}}</a>
												{{else}}
												<a href="{{$value.path}}/index.html" data-lang="{{$value.name}}">{{$value.name}}</a>
												{{/if}}
											 {{else}}
											 <a href="{{$value.path}}/index.html" data-lang="{{$value.name}}">{{$value.name}}</a>
											 {{/if}}
										 {{else}}
											 {{if navSub}}
												{{if $value.name==navSub.cate.name}}
												<a class="active" href="{{$value.path}}/page.html" data-lang="{{$value.name}}">{{$value.name}}</a>
												{{else}}
												<a href="{{$value.path}}/page.html" data-lang="{{$value.name}}">{{$value.name}}</a>
												{{/if}}
											 {{else}}
											 <a href="{{$value.path}}/page.html" data-lang="{{$value.name}}">{{$value.name}}</a>
											 {{/if}}
										 {{/if}}
									</div>
									{{/if}}
									{{/each}}
								{{/if}}
							</div> 
							{{/each}}
							<div style="width: 16vw;"><!--占位--></div>
						 </div>
					 </div>
				</div>
				{{/if}}
				
			</li>
			{{else}}
			<li class="about"><a href="{{$value.path}}/page.html" data-lang="{{$value.name}}">{{$value.name}}</a>
			
				{{if nav.length>0}}
				<div class="suboption">
					<div style="display: flex;flex-direction: row-reverse;background: rgba(214, 214, 214, 0.12);backdrop-filter: blur(70px);margin-top: 30px;">
						<div style="width: 11.5vw;"></div>
						{{each nav}}
						<div>
							{{if $value.children && $value.children.length>0}}
								{{each $value.children}}
								{{if $value.status == 0}}
								<div>
									 {{if $value.type==0}}
									 <a href="{{$value.path}}/index.html" title="{{$value.name}}" data-lang="{{$value.name}}">{{$value.name}}</a>
									 {{else}}
									 <a href="{{$value.path}}/page.html" title="{{$value.name}}" data-lang="{{$value.name}}">{{$value.name}}</a>
									 {{/if}}
								</div>
								{{/if}}
								{{/each}}
							{{/if}}
						</div> 
						{{/each}}
					 </div>
				</div>
				{{/if}}
				
			</li>
			{{/if}}
		{{/if}}
		{{/each}}
	{{/if}}
		
		<li><a href="/" style="padding:2px 5px;background-color: rgba(35, 117, 255, 1);border-radius: 5px;margin-right: 5px;">繁体</a><a href="/en">EN</a></li>
    </ul>
		
 
</header>

<!-- <div class="suboption">
	<div style="display: flex;flex-direction: row-reverse;background: rgba(214, 214, 214, 0.12);backdrop-filter: blur(70px);margin-top: 30px;">
		<div style="width: 11.5vw;"></div>
		<div>
		 <div><a href="/brand/index.html">发展历程</a></div>
		 <div><a href="/brand/index.html">股东介绍</a></div>
		 <div><a href="/brand/index.html">合作伙伴</a></div>
		 <div><a href="/brand/index.html">加入我们</a></div>
		 <div><a href="/brand/index.html">联系我们</a></div>
		</div> 
		 
		 <div>
		  <div><a href="/Important/index.html">一线传声</a></div>
		  <div><a href="/Important/index.html">时事新闻</a></div>
		  <div><a href="/Important/index.html">公司动态</a></div>
		  <div><a href="/Important/index.html">视频专区</a></div>
		 </div> 
		 
		 <div>
		  <div><a href="/productseries/index.html">推荐产品</a></div>
		  <div><a href="/productseries/index.html">保险理财</a></div>
		  <div><a href="/productseries/index.html">银行理财</a></div>
		  <div><a href="/productseries/index.html">数字资产</a></div>
		  <div><a href="/productseries/index.html">智慧金融</a></div>
		  <div><a href="/productseries/index.html">家族财富</a></div>
		  <div><a href="/productseries/index.html">管理更多</a></div>
		 </div> 
		 
		 <div>
		   <div><a href="/about/index.html">公司简介</a></div>
		   <div><a href="/about/index.html">企业文化</a></div>
		   <div><a href="/about/index.html">投资理念</a></div>
		   <div><a href="/about/index.html">组织架构</a></div>
		   <div><a href="/about/index.html">发展荣誉</a></div>
		  </div> 
	 </div>
</div> -->